<!DOCTYPE html>
<html class="am-touch js cssanimations">
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>会员中心</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <meta name="renderer" content="webkit" />
    <link rel="icon" type="image/png" href="../assets/i/favicon.png" />
    <link rel="stylesheet" href="../assets/css/amazeui.min.css" />
    <link rel="stylesheet" href="../assets/css/app2.css" />
    <link rel="stylesheet" href="../assets/css/icon2.css"/>
    <style type="text/css">
        p{margin: 0;}
        ul, li{padding: 0;margin: 0;}
        .products-list ul li{color: #999999}
        .products-list ul li a span{margin: 0;}
        .products-list ul li a input{border: none; height: 35px;width: 210px;}
        .products-list ul li a span{color: #333333;padding: 0;font-size: 14px;}
        .products-list ul li a span.tel{text-align: center;}
        .red{color: #ef4437 !important}
        .am-header input.txt{width: 230px; height: 35px; padding: 5px 10px;border: 1px solid #e8e8e8; border-radius: 5px;}
        .am-btn{width: 55px; height: 35px;line-height: 35px;display: inline-block;margin-left: 5px;font-size: 14px;border-radius: 5px;}
    </style>
</head>
<body>
<!--
<div class="am-header">
    <input type="text" placeholder="输入手机号" class="txt" />
    <button type="submit" class="am-btn-success am-btn">搜索</button>
</div>
-->
<section id="kuaikuai-tab">
    <div data-am-widget="tabs" class="am-tabs am-tabs-d2">
        <ul class="am-tabs-nav tabs-nav am-cf">
            <li class="am-active">
                <a data-kuai-tabs="0">未接单</a>
            </li>
            <li class="">
                <a data-kuai-tabs="1">已接单</a>
            </li>
            <li class="">
                <a data-kuai-tabs="2">已取消</a>
            </li>
        </ul>
    </div>

    <div class="am-tabs-bd" id="ok" style="border: 1px solid #d2d2d2;">
        <div class="am-tab-panel am-active" data="tab1">

            <section class="products-list">
                <ul>
                    <li>
                        <a href="#">
                            <span class="name am-u-sm-3">高富帅</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>

                    <li>
                        <a>
                            <span class="name am-u-sm-3">高富帅</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>
                    <li>
                        <a>
                            <span class="name am-u-sm-3">白富美</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">(加急)</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>
                    <li>
                        <a>
                            <span class="name am-u-sm-3">我爸李刚</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>
                </ul>
                <section style="padding: 10px 20px;background-color: #eee;color: #A19A9A">
                    <p>以下数据列表是昨天的</p>
                </section>
            </section>

        </div>

        <div class="am-tab-panel " data="tab2">

            <section class="products-list">
                <ul>
                    <li>
                        <a href="#">
                            <span class="name am-u-sm-3">高富帅</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>

                    <li>
                        <a>
                            <span class="name am-u-sm-3">高富帅</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>
                    <li>
                        <a>
                            <span class="name am-u-sm-3">白富美</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">(加急)</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>
                    <li>
                        <a>
                            <span class="name am-u-sm-3">我爸李刚</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>
                </ul>
            </section>

        </div>

        <div class="am-tab-panel " data="tab3">

            <section class="products-list">
                <ul>
                    <li>
                        <a href="#">
                            <span class="name am-u-sm-3">高富帅</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>

                    <li>
                        <a>
                            <span class="name am-u-sm-3">高富帅</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>
                    <li>
                        <a>
                            <span class="name am-u-sm-3">白富美</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">(加急)</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>
                    <li>
                        <a>
                            <span class="name am-u-sm-3">我爸李刚</span>
                            <span class="tel am-u-sm-4">1300607130</span>
                            <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                            <span class="time am-u-sm-2">10:30</span>
                            <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
                        </a>
                    </li>
                </ul>
            </section>

        </div>
    </div>
</section>

<!--
<div class="products-list">
    <ul>
        <li>
            <a href="#">
                <span class="name am-u-sm-3">高富帅</span>
                <span class="tel am-u-sm-4">1300607130</span>
                <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                <span class="time am-u-sm-2">10:30</span>
                <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
            </a>
        </li>

        <li>
            <a>
                <span class="name am-u-sm-3">高富帅</span>
                <span class="tel am-u-sm-4">1300607130</span>
                <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                <span class="time am-u-sm-2">10:30</span>
                <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
            </a>
        </li>
        <li>
            <a>
                <span class="name am-u-sm-3">白富美</span>
                <span class="tel am-u-sm-4">1300607130</span>
                <span class="am-u-sm-2 red">(加急)</span>
                <span class="time am-u-sm-2">10:30</span>
                <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
            </a>
        </li>
        <li>
            <a>
                <span class="name am-u-sm-3">我爸李刚</span>
                <span class="tel am-u-sm-4">1300607130</span>
                <span class="am-u-sm-2 red">&nbsp;&nbsp;</span>
                <span class="time am-u-sm-2">10:30</span>
                <span class="am-fr"><i class="ui-fonts icon-chevron-right am-fr">&#xe601;</i></span>
            </a>
        </li>
    </ul>
</div>
-->

<script src="../assets/js/jquery.min.js" type="text/javascript"></script>
<script src="../assets/js/amazeui.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function() {
        //  tab点击切换
        $('.tabs-nav a').on('click', function() {
            $('.am-tabs-bd').css({ 'display':'block' });
            $('.am-tabs-nav > li').removeClass('am-active');
            $(this).parent().addClass('am-active');
            $('.am-tabs-bd div').removeClass('am-active');
            var tabsNum = $(this).attr('data-kuai-tabs');
            var aTabs = $('.am-tabs-bd div');
            $(aTabs[tabsNum]).addClass('am-active');
        });
    });
</script>
</body>
</html>